<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>单行文本溢出显示省略号</title>
</head>
<style>
    div {
        width: 150px;
        height: 80px;
        background-color: gray;
        margin: 100px auto;
        /*这个单词的意思是如果文字显示不开自动换行*/
        /*white-space: normal;*/
        /*这个单词的意思是如果文字显示不开也必需强制一行显示*/
        white-space: nowrap;
        overflow: hidden;
        /*文字溢出用省略号显示*/
        text-overflow: ellipsis;
    }
</style>
<body>
    <div>
        测试，单行文本溢出显示省略号
    </div>
</body>
</html>